<!-- 导出 -->
<template>
  <!-- <div class="vb"> -->
  <el-button :type="type" :icon="icon" @click="handleClick" :disabled="disabled" v-bind="$attrs" v-on="$listeners">{{text}}</el-button>
  <!-- </div> -->
</template>
<script>
export default {
  name: 'ZmExport',
  props: {
    type: { // 按钮类型
      type: String,
      default: 'default'
    },
    rowParams: {
      type: Object,
      default () {
        return {}
      }
    },
    isRow: Boolean, // 表格行的导出
    icon: { // 按钮图标
      type: String,
      default: ''
    },
    api: { // 调用接口
      type: Function,
      default: () => { }
    },
    params: { // 请求参数
      type: Object,
      default () {
        return {}
      }
    },
    text: { // 按钮文案
      type: String,
      default: '导出'
    },
    beforeExportFn: { // 导出前处理函数
      type: Function,
      default: () => { }
    },
    disabled: { // 是否禁用按钮
      type: Boolean,
      default: false
    },
    readonly: Boolean // 是否按钮只做展示作用

  },
  data () {
    return {
    }
  },
  created () { },
  mounted () { },
  methods: {
    handleClick () {
      this.$emit('click')
      if (!this.readonly) {
        this.onExport()
      }
    },
    async onExport () {
      const that = this
      let _loading = null
      await this.beforeExportFn()
      setTimeout(() => {
        const params = this.isRow ? this.rowParams : this.params
        function exportApi (resQuery = {}) {
          that.api({...params, ...resQuery}).then(_res => {
            _loading = that.$loading({
              lock: true,
              text: `正在导出`,
              spinner: 'el-icon-loading',
              background: 'rgba(0, 0, 0, 0.7)'
            })
            if (_res.status === 0) {
              if (_loading) _loading.text = `正在导出${_res.page ? ('第' + _res.page + '页') : ''}`
              exportApi({fileName: _res.fileName, page: _res.page})
              return
            } else {
              if (_loading) _loading.close()

              if (_res && _res.url) {
                const temp = _res.url.split('/')
                const name = (temp.length && temp[temp.length - 1]) || new Date().toLocaleString()
                const link = document.createElement('a')

                link.style.display = 'none'
                link.href = _res.url
                link.setAttribute('download', name)
                document.body.appendChild(link)
                link.click()
                that.$message.success('导出成功')
                that.$emit('after-export')

                setTimeout(() => {
                  document.body.removeChild(link)
                }, 20000)
              } else {
                that.$confirm('导出成功!', {
                  confirmButtonText: '前往下载中心'
                }).then(() => {
                  that.$router.push({
                    name: 'downloadCenter'
                  })
                  that.$emit('after-export')
                })
              }
            }
          }).catch(err => {
            if (err.status === 30001) {
              that.params.page += 1
              that.onExport()
            }
            that.$emit('err-export', err)
          })
        }
        exportApi()
      }, 0)
    }
  }
}
</script>
